frontend/src/app/products/[id]/page.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

import { Header } from "@/components/header";
import { Footer } from "@/components/footer";
import { ProductPage } from "@/components/product-page";

interface ProductPageProps {
  params: Promise<{
    id: string;
  }>;
}

export default async function Product({ params }: ProductPageProps) {
  const { id } = await params;
  
  return (
    <>
      <Header />
      <ProductPage productId={id} />
      <Footer />
    </>
  );
}

export async function generateMetadata({ params }: ProductPageProps) {
  // In a real app, you'd fetch the product data here based on params.id
  const { id } = await params;
  const productName = id === "1" ? "Oversized Cotton Hoodie" : "Product";
  
  return {
    title: `${productName} | blcklst`,
    description: `Shop the ${productName} at blcklst. Premium quality fashion pieces that define modern elegance.`,
  };
}